import * as THREE from "three";
import { CSS3DRenderer } from 'three/addons/renderers/CSS3DRenderer.js';
// 引入Three.js扩展库
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
var width = window.innerWidth;
var height = window.innerHeight;
// 创建一个透明相机
const camera = new THREE.PerspectiveCamera(30, width / height, 1, 3000);
// // 设置相机的位置
camera.position.set(0, 0, 350);
// 设置相机指向
camera.lookAt(0, 0, 0);
// 创建renderer
/**
 * 创建渲染器对象
 */
var renderer = new THREE.WebGLRenderer({
    antialias: true, //开启锯齿
});
renderer.outputEncoding = THREE.sRGBEncoding;
renderer.setPixelRatio(window.devicePixelRatio);//设置设备像素比率,防止Canvas画布输出模糊。
renderer.setSize(width, height); //设置渲染区域尺寸
new OrbitControls(camera, renderer.domElement);

// 创建CSS3DObject
const labelRenderer = new CSS3DRenderer()
labelRenderer.setSize(width, height); //设置渲染区域尺寸
labelRenderer.domElement.style.position = 'absolute';
// 相对标签原位置位置偏移大小
labelRenderer.domElement.style.top = '0px';
labelRenderer.domElement.style.left = '0px';
// //设置.pointerEvents=none，以免模型标签HTML元素遮挡鼠标选择场景模型
labelRenderer.domElement.style.pointerEvents = 'none';
export {camera,renderer,labelRenderer};